<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <title>学园 - 首页</title>
    <link rel="stylesheet" type="text/css" href="../web_terminal/trunk/assets/css/reset.css">
    <link rel="stylesheet" type="text/css" href="../web_terminal/trunk/assets/css/base.css">
    <link rel="stylesheet" type="text/css" href="../web_terminal/trunk/assets/css/layout.css">
    <link rel="stylesheet" type="text/css" href="../web_terminal/trunk/assets/css/index.css">
</head>

<body>
    <div class="navigation">
        <div class="xywrap topinner">
            <a href="#" class="top-link-logo" id="top-link-logo">学园</a>
            <div class="topsearch">
                <form action="" class="top-search-form" method="post">
                    <input type="text" class="top-search-input" id="" name="" autocomplete="off" value="" placeholder="搜索感兴趣的话题" /><i class="icon-search iconfont">&#xe674;</i>
                </form>
            </div>
            <div class="navcontent" id="">
                <ul>
                    <li>
                        <a href="#" class="topnavx">首页</a>
                    </li>
                    <li><a href="#" class="topnavx">圈子</a></li>
                    <li id="btn-msg" style="position:relative;"><a href="#" class="topnavx">消息</a>
                    <div id="nav-msg" class="nav-messaga-wrap" style="position:absolute;background: #fff;display:none;">
                        <div class="nav-message-wrap-title clearfix">
                            <div class="navmessage-title-inner" id="myNoticeTab">
                                <button class="navmessage-title-item">
                                    <span class="navmessage-title-icon message-icon active"></span>
                                </button>
                                <button class="navmessage-title-item">
                                    <span class="navmessage-title-icon follower-icon"></span>
                                </button>
                                <button class="navmessage-title-item">
                                    <span class="navmessage-title-icon zan-icon"></span>
                                </button>
                            </div>
                        </div>
                        <div class="navmessage-content clearfix">
                            <div class="navmessage-content-inner" style="display: block;">
                                <div class="navmessage-content-body">
                                    <div class="content-body-item" style="padding:10px 5px;">
                                        <span class="name" style="color: #0072dc;">许哲</span>
                                        <span class="type">赞了你<span class="title" style="color: #0072dc;">高数应该怎么学</span>话题的评论</span>        
                                    </div>
                                    <div class="content-body-item" style="padding:10px 5px;">
                                        <span class="name" style="color: #0072dc;">许哲</span>
                                        <span class="type">评论了你发表的<span style="color: #0072dc">高数到底怎么学</span>话题</span>    
                                    </div>
                                    <div class="content-body-item" style="padding:10px 5px;">
                                        <span class="name" style="color: #0072dc;">许哲</span>
                                        <span class="type">回复了你<span style="color: #0072dc">高数到底怎么学</span>话题</span>    
                                    </div>
                                </div>
                            </div>
                            <div class="navmessage-content-inner" style="display: none;">
                                <div class="navmessage-content-body">
                                    <div class="content-body-item" style="padding:10px 5px;">
                                        <span class="name" style="color: #0072dc;">
                                            许哲
                                        </span>
                                        <span>
                                            @了你
                                        </span>
                                    </div>
                                </div>
                            </div>
                            <div class="navmessage-content-inner" style="display: none;">
                                <div class="navmessage-content-body">
                                    <div class="follow-content-item" style="padding:10px 5px;">
                                        <span class="name" style="color: #0072dc;">许哲</span>
                                        <span>私信了你</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="navmessage-wrap-footer">
                            <a href="" class="navmessage-footer-seeall">查看全部&gt&gt</a>
                            <a href="#" class="navmessage-footer-setting">
                                <i class="footer-setting-icon"></i>
                            </a>
                        </div>
                    </div>
                    </li>

                </ul>
            </div>

            <div class="top-nav-selfinfo">
                <a href="#" class="top-nav-userinfo" id="" role="button">
                    <span class="name">Rose</span>
                    <img class="avatar">
                </a>
                <ul class="top-nav-dropdown" id="">
                    <li>
                        <a href="#" id="">个人主页</a>
                    </li>
                    <li>
                        <a href="#" id="">设置</a>
                    </li>
                    <li>
                        <a href="#" id="">退出</a>
                    </li>
                </ul>
            </div>
            <button id="btn-createTopic" href="#createTopic" class="create-circle">发表</button>
        </div>

    </div>
    <div class="wrapper">
        <div class="main-content">
            <div class="main-content-inner">
                <div class="home-list">
                    <div class="home-list-title">
                        <span>关注人的动态</span>
                    </div>
                    <div class="home-list-content clearfix">
                        <ul id="dynamicMore">
                            <li class="dynamic-item">
                            <span style="padding-left: 2em;">您还没有关注的用户，赶紧去关注吧！</span>
                                <div class="rep">
                                    <div class="rep-header clearfix">
                                        <div class="rep-avatar portrait"></div>
                                        <div class="rep-note">
                                            <span class="rep-auth-src name"></span>&nbsp<span class="rep-catalog text-small type"></span>
                                            <div class="rep-title ellipsis title"></div>
                                        </div>
                                    </div>
                                    <div class="rep-content-wrapper clearfix">
                                        <div class="rep-content content">
                                        </div>
                                        <div class="rep-footer text-small clearfix">
                                            <div class="rep-cir-src from"></div>
                                            <div class="rep-time date"></div>
                                        </div>
                                    </div>
                            </li>
                            <a id="btn-more-dynamic" class="btn-white btn-more">查看更多</a>
                        </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="createTopic" class="submit-content" style="display: none;">
            <div class="submit-form">
                <form action="#" class="form-form">
                    <div class="content-circle-select clear">
                        <div class="topic-create-title">
                            <span class="right-decoration-text">
                            发表新贴:
                        </span>
                        </div>
                        <input type="text" style="width: 230px;">
                    </div>
                    <div class="content-topic-create clear">
                        <div class="topic-create-title">
                            <span>发表话题：</span>
                        </div>
                        <div class="topic-create-edit">
                            <div class="topic-edit-wrap">
                                <div class="edit-wrap-outer">
                                    <textarea name="" id="" cols="30" rows="8" style="width: 230px;"></textarea>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="submit-finish-part">
                        <button class="right-btn-decoration btn-blue" style="padding: 2px 5px;">提交</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="../web_terminal/trunk/assets/js/jquery-1.10.1.min.js"></script>
    <script>
    $(document).ready(function() {
        $('#btn-msg').click(function () {           
            $('#nav-msg').toggle();
        });
        $('#myNoticeTab button').click(function() {
            $(this).children().addClass("active").parent().siblings().children().removeClass("active");
            $(".navmessage-content-inner").hide().eq($('#myNoticeTab button').index(this)).show();
            return false;
        });
        $(document).bind('click', hide);
        function hide(e){
            if($(e.target)[0].id =="nav-msg")
                return;
            $("#nav-msg").hide();
        }
    });
    </script>
</body>

</html>
